new Vue({
    el: '#app',
    data: {
        defaultArea: window.localStorage.getItem('city_id'),
        area: window.localStorage.getItem('city_id'),
        keyword: document.getElementById("keyword").value,
        region: 0,
        city: [],
        cityArea: [],
        townData:[],
        station: [],
        stationData: [],
        cur: 0,
        curMetro: 0,
        metro: [],
        metro_id: 0,
        seo_title:'',
        minPrice: '',
        maxPrice: '',
        apartment: [],
        wytype: [],
        renovation: [],
        feature: [],
        searchStatus: false,
        loading: false,
        proData: '',
        current: 1,
        pageSize: 10,
        total: 0,
        inregion: '',
        inunit: '',
        budget: '',
        mobile: '',
        sort: 'default',
        showTxt: '更多条件',
        showMore: true,
        showClass: '',
        send_loading:false
    },
    methods: {
        handleFindHouse(){
            if(this.inregion.length == 0 || this.inunit.length == 0 || this.budget.length == 0 || this.mobile.length == 0){
                this.$Notice.error({
                    title: '信息不能为空',
                });
                return
            }
            if (this.mobile.length != 11){
                this.$Notice.error({
                    title: '手机号为11数字',
                });
                return
            }
            this.send_loading = true
            var formData = {
                'area': this.inregion,
                'apartment': this.inunit,
                'price': this.budget,
                'tel': this.mobile,
            }
            var that = this
            axios.post("/findhouse",formData).then(function (response) {
                if(response.data.code === 0){
                    that.$Notice.success({
                        title: '提示信息',
                        desc: response.data.msg
                    });
                }else{
                    that.$Notice.error({
                        title: '提示信息',
                        desc: response.data.msg
                    });
                }
                that.send_loading = false
                that.inregion = ''
                that.inunit = ''
                that.budget = ''
                that.mobile = ''
            }).catch(function (error) {
                if (typeof error.response.data.errors.area != "undefined") {
                    that.$Notice.error({
                        title: error.response.data.errors.area[0],
                    });
                }
                if (typeof error.response.data.errors.apartment != "undefined") {
                    that.$Notice.error({
                        title: error.response.data.errors.apartment[0],
                    });
                }
                if (typeof error.response.data.errors.price != "undefined") {
                    that.$Notice.error({
                        title: error.response.data.errors.price[0],
                    });
                }
                if (typeof error.response.data.errors.tel != "undefined") {
                    that.$Notice.error({
                        title: error.response.data.errors.tel[0],
                    });
                }
                that.send_loading = false
            });
        },
        shorOrHide(){
            if (this.showMore){
                this.showClass = 'show'
                this.showMore = false
                this.showTxt = '收起条件'
            }else{
                this.showClass = ''
                this.showMore = true
                this.showTxt = '更多条件'
            }
        },
        clearKeywords(){
            this.keyword = ''
            this.getData()
        },
        getData(){
            if (this.loading) return
            this.loading = true
            if(parseInt(this.minPrice) > parseInt(this.maxPrice)){
                [this.minPrice,this.maxPrice] = [this.maxPrice,this.minPrice]
            }
            var that = this
            var formData = {
                keyword: that.keyword,
                area:(that.townData.length || that.metro_id)?0:that.area,
                average:that.minPrice+'_'+that.maxPrice,
                apartment:that.apartment,
                wytype:that.wytype,
                renovation_id:that.renovation,
                feature:that.feature,
                pagesize:that.pageSize,
                sort: that.sort,
                town_id: that.metro_id?[]:that.townData,
                metro_station_id: that.stationData,
                metro_id: that.stationData.length?0:that.metro_id
            }
            axios.post(`/property/data?page=${this.current}`,formData).then(function (response) {
                if(response.data.code === 0){
                    that.loading = false
                    that.searchStatus = true
                    that.proData = response.data.data.data
                    that.total = response.data.data.total
                }else{
                    that.$Message.error('数据获取失败，请稍后再试')
                }
            }).catch(function (error) {
                that.loading = false
            });
        },
        handleChangeSize(val) {
            this.pageSize = val
            this.$nextTick(() => {
                this.getData()
            })
        },
        changeSort(obj){
            this.sort = obj
            this.getData()
        },
        calFeature(){
            let featureid = document.getElementById("featureid").value
            if(Number(featureid) > 0){
                var arr = new Array()
                arr[0] = featureid
                this.feature = arr
            }
        },
        getCityAndMetro(){
            var that = this
            var formData = {
                area:that.area
            }
            axios.post('/region/city',formData).then(function (res) {
                if(res.data.code === 0){
                    that.city = res.data.city
                    that.metro = res.data.metro
                    that.seo_title = res.data.seo_info.seo_title
                }else{
                    that.$Message.error('数据获取失败，请稍后再试')
                }
            }).catch(function (error) {
                // that.loading = false
            });
        },
        changeRegion(id){
            var that = this
            that.cur = id
            var formData = {
                area_id:id
            }
            that.area = id
            that.townData = []
            that.$nextTick(function () {
                that.getData()
            })
            axios.post('/region/cityArea',formData).then(function (res) {
                if(res.data.code === 0){
                    that.cityArea = res.data.area
                }else{
                    that.$Message.error('数据获取失败，请稍后再试')
                }
            }).catch(function (error) {
                // that.loading = false
            });
        },
        changeMetro(id){
            var that = this
            that.curMetro = id
            var formData = {
                metro_id:id
            }
            // that.area = window.localStorage.getItem('city_id')
            that.metro_id = id
            that.stationData = []
            that.$nextTick(function () {
                that.getData()
            })
            axios.post('/region/metroStation',formData).then(function (res) {
                if(res.data.code === 0){
                    that.station = res.data.station
                }else{
                    that.$Message.error('数据获取失败，请稍后再试')
                }
            }).catch(function (error) {
                // that.loading = false
            });
        },
        changeTab(){
            this.area = window.localStorage.getItem('city_id')
            this.cityArea = []
            this.townData = []
            this.station = []
            this.stationData = []
            this.cur = 0
            this.curMetro = 0
            this.metro_id = 0
            this.$nextTick(function () {
                this.getData()
            })
        },
        clearPrice(){
            this.minPrice = ''
            this.maxPrice = ''
            this.getData()
        }
    },
    created(){
        this.getCityAndMetro()
    },
    mounted() {
        this.calFeature()
        this.getData()
    }
})